﻿@page "_Host"
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@using Simple.Framework.Client
@using Simple.Framework.Server
@using Microsoft.Extensions.Options

@inject IOptions<HybridOptions> HybridOptions
@{
    var hybridType = HybridOptions?.Value?.HybridType ?? HybridType.HybridOnNavigation; 
}
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>Simple.Framework: @hybridType</title>
    <base href="/" />
    <link href="css/app.css" rel="stylesheet" />
    @*<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />*@
    <link rel="stylesheet" href="_content/Radzen.Blazor/css/default.css">
    <link href="Simple.Framework.Client.styles.css" rel="stylesheet" />
</head>

<body>

    @if (hybridType.ToString().StartsWith("Hybrid"))
    {
        <srvr-app>
            <component type="typeof(App)" render-mode="ServerPrerendered" />
            <persist-component-state />
        </srvr-app>
        <wasm-app style="display: none;">
            <component type="typeof(App)" render-mode="WebAssembly">
        </wasm-app>
    }

    <script>
        window.hybridType = '@hybridType';
        window.getHybridType = function () { return window.hybridType; }
    </script>

    @if (hybridType == HybridType.ServerSide)
    {
        <app>
            <component type="typeof(App)" render-mode="ServerPrerendered" />
            <persist-component-state />
        </app>
        <script src="_framework/blazor.server.js"></script>
    }
    else if (hybridType == HybridType.WebAssembly)
    {
        <app>
            <component type="typeof(App)" render-mode="WebAssemblyPrerendered">
        </app>
        <script src="_framework/blazor.webassembly.js"></script>
    }
    else
    {
        <script src="blazor.hybrid.js"></script>
    }

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>
    <script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>
</body>

</html>